import React from 'react';
import { render } from 'react-dom';
import { createStore } from 'redux'
import UserApp from './reducers'
import { Provider } from 'react-redux'
import { Router, Route, IndexRedirect, browserHistory } from 'react-router'
import App from './components/App'
import Login from './containers/Login'
import Root from './components/Root'
// import Layout from './components/Layout'
import EnsureLoggedInContainer from './containers/EnsureLoggedInContainer'
import injectTapEventPlugin from 'react-tap-event-plugin';

// Needed for onTouchTap
// http://stackoverflow.com/a/34015469/988941
injectTapEventPlugin();

const store = (window.devToolsExtension
    ? window.devToolsExtension()(createStore)
    : createStore)(UserApp)

store.subscribe(() =>
    console.log(store.getState())
)
// const store = createStore(UserApp)

// 每次 state 更新时，打印日志
// 注意 subscribe() 返回一个函数用来注销监听器
render(
    <Provider store={store} >
        <Router history={browserHistory}>
            <Route path="/login" component={Login} />
            <Route path="/" component={Root}>
                <IndexRedirect to='/users/'/>
                <Route component={EnsureLoggedInContainer}>
                    <Route path="/users/(:filter)" component={App} />
                </Route>
            </Route>
        </Router>
    </Provider>,
    document.getElementById('root')
);
